<template>
    <div class="step-content" v-show="stepShow">
        <form ref="form" enctype="multipart/form-data" method="post" class="ivu-upload upload-form">
            <Upload @fileChange="setfileName" ref="upload" name="file"></Upload>
            <Input placeholder="模板名称（必填）" :value="data.name" @input="updateData({code:'name',value:$event})"></Input>
            <Input placeholder="模板编码（必填）" :value="data.code" @input="updateData({code:'code',value:$event})"></Input>
            <SelectControl ref="ds" @input="updateData({code:'ds_id',value:$event})" :value="data.ds_id" :data="dsData" placeholder="请选择数据源（必填）">
            </SelectControl>
            <div class="form-item">
                <Checkbox :value="data.enable_create" @input="updateData({code:'enable_create',value:$event})">新建实体</Checkbox>
            </div>
            <Input placeholder="备注" :value="data.memo" @input="updateData({code:'memo',value:$event})" type="textarea" :rows="4"></Input>
        </form>
    </div>
</template>

<script>
import Step from './step'
import SelectControl from '@/element/select'
import Upload from '@/element/upload'
import { submitForm } from '@/common'

export default {
    extends: Step,
    methods: {
        submit() {
            submitForm(`${this.path.upload}?enable_create=${this.data.enable_create}&code=${this.data.code}&name=${this.data.name}&ds_id=${this.data.ds_id}`, null, {
                form: this.$refs.form,
                file: this.$refs.upload.file
            }).then((res) => {
                if (this.data.enable_create) {
                    this.setSheetEntityData(res.data)
                } else {
                    this.setSheetData(res.data)
                }
                this.initMappingData()
                return this.fetchEntity()
            }).then(() => {
                this.setMappingLoad(true)
                this.$emit('next')
            })
        }
    },
    components: {
        SelectControl,
        Upload
    }
}
</script>

<style lang="less">
.upload-form {
    .ivu-input-wrapper {
        margin-top: 15px;
        margin-bottom: 15px;
    }
    .form-item {
        margin-top: 10px;
        margin-bottom: -5px;
        margin-left: 2px;
        .ivu-checkbox-input[type=checkbox] {
            height: auto;
        }
    }
}
</style>
